const gulp = require("gulp")
const connect = require("gulp-connect")
const htmlmin = require("gulp-htmlmin")
const cleanCss = require("gulp-clean-css");
const uglify = require('gulp-uglify');
var babel = require('gulp-babel');
var sass = require('gulp-sass');

gulp.task('img',()=>{
	
	gulp.src('src/images/**')
	
	.pipe(gulp.dest('dist/images'))
	
	.pipe(connect.reload())
	
}) 

gulp.task('lib',()=>{
	
	gulp.src('src/lib/**')
	
	.pipe(gulp.dest('dist/lib'))
	
	.pipe(connect.reload())
	
}) 

gulp.task('server',function(){
	
	connect.server({
		
		livereload:true,
		
		port:2003,
		
		root:'dist',
		
	})
	
})

gulp.task("html",function(){
	
	gulp.src("src/html/**")
	
	.pipe(htmlmin({
		
		removeComments:true,
		
		collapseWhitespace:true,
		
		minifyJS:true,
		
		minifyCSS:true,
		
	}))
	
	.pipe(gulp.dest("dist/html"))
	
	.pipe(connect.reload())
	
})

gulp.task("index",function(){
	
	gulp.src("src/index.html")
	
	.pipe(htmlmin({
		
		removeComments:true,
		
		collapseWhitespace:true,
		
		minifyJS:true,
		
		minifyCSS:true,
		
	}))
	.pipe(gulp.dest("dist"))
	
	.pipe(connect.reload())
	
})




gulp.task('js', () => {

   gulp.src('src/js/**/*.js')

   .pipe(babel({

     presets:['@babel/env']

   }))

   .pipe(uglify())

   .pipe(gulp.dest('dist/js'))
   
   .pipe(connect.reload())

})
// gulp.task('js',()=>{
	
// 	gulp.src('src/js/**')
	
// 	.pipe(gulp.dest('dist/js'))
	
// 	.pipe(connect.reload())
	
// }) 


gulp.task('sass', function(){

   gulp.src('src/css/**')

   .pipe(sass())
	
   .pipe(cleanCss())
	
   .pipe(gulp.dest('dist/css'))
   
   .pipe(connect.reload())

});


gulp.task('watch',function(){

  gulp.watch('src/css/**',['sass']);

  gulp.watch('src/html/**',['html']);
  
  gulp.watch('src/*.html',['index']);

  gulp.watch('src/js/**/*.js',['js']);

})

gulp.task("default",["server","sass","html", "js","lib","index","img","watch"]);